<!DOCTYPE html>

<html>

<head>

<title>vizito响应式触屏手机网站模板</title>

<!-- meta tags start -->

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />


<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />

<!-- meta tags end -->



<!-- favorite icon starts -->

<link rel="shortcut icon" href="images/common/favicon.ico" type="image/x-icon" />

<!-- favorite icon ends -->







<!-- CSS files start -->

<link href="css/framework.css" rel="stylesheet" type="text/css" media="all" />

<link href="css/colorbox.css" rel="stylesheet" type="text/css" media="all" />

<link href="css/elements.css" rel="stylesheet" type="text/css" media="all" />

<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />

<link href="css/responsive.css" rel="stylesheet" type="text/css" media="screen" />

<link href="css/hidpi.css" rel="stylesheet" type="text/css" media="screen" />

<link href="css/skin.css" rel="stylesheet" type="text/css" media="all" />

<link href="css/custom.css" rel="stylesheet" type="text/css" media="all" />

<!-- CSS files end -->



<!-- JavaScript files start -->

<script type="text/javascript" src="js/jquery.min.js"></script>

<script type="text/javascript" src="js/effects.jquery-ui.min.js"></script>

<script type="text/javascript" src="js/jquery.nivo-slider.min.js"></script>

<script type="text/javascript" src="js/jquery.colorbox.min.js"></script>

<script type="text/javascript" src="js/custom.js"></script>

<!-- JavaScript files end -->

</head>

<body>

<!-- website wrapper starts -->

<div class="websiteWrapper"> 

  

  <!-- main menu wrapper starts -->

  <ul class="mainMenuWrapper">

    <li><a href="index.html">网站首页</a></li>

    <li><a href="typography.html">公司简介</a> </li>

    <li><a href="faq.html">折叠菜单</a></li>

    <li><a href="404.html">404页面</a></li>

    <li><a href="portfolioOneColumn.html">单列图片</a></li>

    <li><a href="portfolioTwoColumns.html">双列图片</a></li>

    <li class="currentPage"><a href="portfolioOneColumnFilterable.html">筛选单列</a></li>

    <li><a href="portfolioTwoColumnsFilterable.html">筛选双列</a></li>

    <li><a href="singleProject.html">文字内容</a></li>

    <li><a href="blog.html">新闻资讯</a> </li>

    <li><a href="singlePost.html">新闻内容</a></li>

    <li><a href="contact.html">联系我们</a></li>

  </ul>

  <!-- main menu wrapper ends --> 

  

  <!-- header wrapper starts -->

  <div class="headerOuterWrapper">

    <div class="headerWrapper"> <a class="mainLogo" href="index.html"><img src="images/mainLogo.png" alt=""/></a> <a href="" class="mainMenuButton"></a><span class="mainMenuDecoLine"></span> </div>

  </div>

  <!-- header wrapper ends -->

  

  <div class="pageBreak headerBreak"></div>

  

  <!-- page wrapper starts -->

  <div class="pageWrapper portfolioOneFilterablePageWrapper"> 

    

    <!-- filterable portfolio menu starts -->

    <ul class="portfolioMenuWrapper" id="portfolioMenuWrapper">

      <li><a href="" data-type="all" class="currentPortfolioFilter">All</a></li>

      <li><a href="" data-type="websites">Websites</a></li>

      <li><a href="" data-type="logos">Logos</a></li>

      <li><a href="" data-type="photos">Photos</a></li>

    </ul>

    <!-- filterable portfolio menu ends --> 

    

    <!-- portfolio wrapper starts -->

    <div class="portfolioOneFilterableWrapper">

      <div class="portfolioFilterableItemsWrapper" id="portfolioFilterableItemsWrapper"> 

        <!-- portfolio item starts  -->

        <div class="portfolioFilterableItemWrapper" data-type="websites,logos"> <a href="singleProject.html" class="portfolioFilterableItemImageWrapper"><img src="images/small-1-3.jpg" alt=""/></a>

          <div class="portfolioFilterableItemInfoWrapper">

            <h4 class="portfolioFilterableItemTitle">Dolores eos qui</h4>

            <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium.</p>

          </div>

          <div class="portfolioFilterableItemButtonsWrapper"><a href="images/large-3.jpg" class="portfolioFilterableExpandButton">expand</a><a href="singleProject.html" class="portfolioFilterableDetailsButton">details</a></div>

        </div>

        <!-- portfolio item ends --> 

        <!-- portfolio item starts  -->

        <div class="portfolioFilterableItemWrapper" data-type="logos"> <a href="singleProject.html" class="portfolioFilterableItemImageWrapper"><img src="images/small-1-4.jpg" alt=""/></a>

          <div class="portfolioFilterableItemInfoWrapper">

            <h4 class="portfolioFilterableItemTitle">Dolores eos qui</h4>

            <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium.</p>

          </div>

          <div class="portfolioFilterableItemButtonsWrapper"><a href="images/large-4.jpg" class="portfolioFilterableExpandButton">expand</a><a href="singleProject.html" class="portfolioFilterableDetailsButton">details</a></div>

        </div>

        <!-- portfolio item ends --> 

        <!-- portfolio item starts  -->

        <div class="portfolioFilterableItemWrapper" data-type="photos"> <a href="singleProject.html" class="portfolioFilterableItemImageWrapper"><img src="images/small-1-5.jpg" alt=""/></a>

          <div class="portfolioFilterableItemInfoWrapper">

            <h4 class="portfolioFilterableItemTitle">Dolores eos qui</h4>

            <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium.</p>

          </div>

          <div class="portfolioFilterableItemButtonsWrapper"><a href="images/large-5.jpg" class="portfolioFilterableExpandButton">expand</a><a href="singleProject.html" class="portfolioFilterableDetailsButton">details</a></div>

        </div>

        <!-- portfolio item ends --> 

      </div>

    </div>

    <!-- portfolio wrapper ends --> 

    

  </div>

  <!-- page wrapper ends --> 

  

  <!-- footer wrapper starts -->

  <div class="footerTopDeco"></div>

  <div class="footerWrapper"> 

    <!-- copyright wrapper starts -->

    <div class="copyrightWrapper"> 

      <!-- copyright starts --> 

      <span class="copyright">Powered by <a href="http://www.17sucai.com" target="_blank">17素材网</a> Copyright &copy; 2014 - 2015</span> 

      <!-- copyright ends --> 

      <!-- back to top button starts --> 

      <a href="" class="backToTopButton"></a> 

      <!-- back to top button ends --> 

    </div>

    <!-- copyright wrapper ends --> 

  </div>

  <!-- footer wrapper ends --> 

  

</div>

<!-- website wrapper ends -->

</body>

</html>

